$(document).ready(function() {
    $('.search').click(function() {
     showView();
     displayLoading();
     closeBox();
   });

    $(document).keyup(function(e) {
        var code = (e.keyCode ? e.keyCode : e.which);
        if (code === 27) { closeBox(); }
    });

    $('.cellline .nonreference').click(function() {
       var $sel = $(this).attr('id');
       $('.cellline .reference').removeClass('reference')
                      .addClass('nonreference')
       $('.cellline .ref'+$sel.toLowerCase())
                  .addClass('reference')
                  .removeClass('nonreference');
       $('#refLine').attr('value',$sel);
    });

    $('#percentage').select2({
        minimumResultsForSearch: 10
    });
    $('#type').select2({
        minimumResultsForSearch: 10
    });
    $('#organism').select2({
        minimumResultsForSearch: 10
    });
    $('#project').select2({
        minimumResultsForSearch: 10
    });

    selectLine();
 });

function closeBox() {
    $(".box").remove();
}

function showView() {
    $(".view").css('display','block');
}

function displayLoading() {
    $("#results").html('<div class="loading">Loading...</div>');
}

function selectLine() {
    var $sel = 'BREAST';
    $('.cellline .ref'+$sel.toLowerCase())
                  .addClass('reference')
                  .removeClass('nonreference');
       $('#refLine').attr('value',$sel);
}

function mouseO(e){
    alert(mouseY+' '+mouseY);
    $('#'+e).css({'top':mouseY,'left':mouseX, 'display':'block'})
            .css('display','block');
}

function queryFormatResult(element) {
//        var markup = "<table class='element-result'><tr>";
//        markup += "<td class='element-element'><div class='element-title'>" + element.type + "</td>";
//        if (element.name !== undefined) {
//            markup += "<td class='element-name'>" + element.name + "</td>";
//        }
//        markup += "<td class='element-description'>" + element.full + "</td>";
//        markup += "</tr></table>"
        var markup = "<div class='result "+element.type+"'>";
        markup += "<div class='type'>"+element.type+":</div>";
        markup += "<div class='name'>"+element.name+"</div>";
        markup += "<div class='full'>"+element.full+"</div></div>";
        return markup;
    }

function queryFormatSelection(element) {
    return "<div class='"+element.type+"'>"+element.name+"</div>";
}

//function movieFormatResult(movie) {
//        var markup = "<table class='movie-result'><tr>";
//        if (movie.posters !== undefined && movie.posters.thumbnail !== undefined) {
//            markup += "<td class='movie-image'><img src='" + movie.posters.thumbnail + "'/></td>";
//        }
//        markup += "<td class='movie-info'><div class='movie-title'>" + movie.title + "</div>";
//        if (movie.critics_consensus !== undefined) {
//            markup += "<div class='movie-synopsis'>" + movie.critics_consensus + "</div>";
//        }
//        else if (movie.synopsis !== undefined) {
//            markup += "<div class='movie-synopsis'>" + movie.synopsis + "</div>";
//        }
//        markup += "</td></tr></table>"
//        return markup;
//    }
//
//function movieFormatSelection(movie) {
//    return movie.title;
//}